@import url('assets/style/mixin.less');

.PageIndexNotice-noMember {
  padding: 76px 36px 40px 48px;
  background-size: calc(100vw - 38px);
  height: 273px;

  .moreText {
    font-size: 28px !important;
    font-weight: 400;
    color: #b4672c !important;
  }

  .noMemberText {
    margin-top: 14px;
    font-size: 24px !important;
    font-weight: 400;
    color: #b4672c !important;
  }

  .noMemberText-openCard {
    font-size: 24px !important;
    font-weight: 500;
    color: #ff7400;
  }

  .noMemberText-right {
    width: 10px;
    height: 18px;
  }

  .memberLogo {
    right: 10px;
    top: 0;
  }

  .footerBtn {
    font-size: 24px !important;
    font-weight: 400;
    color: #b4672c !important;
    background: linear-gradient(180deg, #fefaf5 0%, rgba(255, 247, 238, 0.99) 100%) !important;
  }
}

.PageIndexNotice-lanjing {
  margin-bottom: 40px;
  .footerBtn {
    background: linear-gradient(180deg, #f2f7ff 0%, rgba(224, 237, 255, 0.75) 100%);
    color: #586090 !important;
  }
  .moreText {
    color: #9095b6 !important;
  }

  .noMemberText {
    color: #586490 !important;
  }
}

.PageIndexNotice-chijing {
  .footerBtn {
    background: linear-gradient(180deg, #fff5f2 0%, rgba(255, 234, 229, 0.95) 100%);
    color: #b04545 !important;
  }
  .moreText {
    color: #9a8b8a !important;
  }

  .noMemberText {
    color: #8f6d6d !important;
  }
}

.PageIndexNotice-shuangchong {
  .footerBtn {
    background: linear-gradient(180deg, #fefaf5 0%, rgba(255, 247, 238, 0.99) 100%);
    color: #b4672c !important;
  }
  .moreText {
    color: #ab855d !important;
  }

  .noMemberText {
    color: #8f6d6d !important;
  }
}

.PageIndexNotice-lanjing,
.PageIndexNotice-chijing,
.PageIndexNotice-shuangchong {
  height: 388px;
  background-size: calc(100vw - 38px) 388px;
  padding: 34px 48px 0 48px;

  .memberLogo {
    top: 38px;
    right: 38px;
  }

  .noMemberText {
    margin: 8px 0;
  }
}

.PageIndexNotice {
  display: flex;
  flex-direction: column;
  background-repeat: no-repeat;
  position: relative;

  .noMemberText {
    font-size: 28px;
    font-weight: 400;
    color: #586490;
    line-height: 40px;
  }

  .memberLogo {
    position: absolute;
    height: 104px;
    width: 264px;
  }

  .moreText {
    font-size: 24px;
    font-weight: 400;
    color: #9095b6;
  }

  .footerBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: 144px;
    font-size: 24px;
    font-weight: 400;
    color: #586090;
    border-radius: 24px;
  }

  .cardNumber {
    color: #ff7400;
  }

  .openMemberBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 400;
    color: #586490;
    min-width: 140px;
    width: 140px;
    height: 52px;
    background: linear-gradient(180deg, #d9d9ff 0%, #ffffff 100%);
    border-radius: 26px;
    margin-left: 30px;
    border: 2px solid #ffffff;
  }
}
